/**
 * create by young (young2f@outlook.com) on 2020/9/16
 * 选择辅料
 */


'use strict';
import React from 'react';
import {Button, Card, Descriptions, Form, Tag} from 'antd';

import FormBase from '../../../components/Base/FormBase';
import {connect} from "dva";
import moment from 'moment';
import 'moment/locale/zh-cn';

import {ModalFooter} from "antd-extra";

const {Meta} = Card;

moment.locale('zh-cn');
const table = 'ProcureOrder';
@Form.create()
@connect(({
            user,
            global,
            dynamicLabel,
            material,
            store
          }) => ({...user, ...material, ...dynamicLabel, ...global, ...store}))
export default class ModalInboundLotDetail extends FormBase {
  constructor(props) {
    super(props);
    const {style, values} = this.props;
    this.state = {...values};
  }

  componentDidMount() {
    console.log('ModalInboundLotDetail', this.state);
  }

  renderFoot = () => {
    const {foot, value, modalRef, form, callback} = this.props;

    if (foot) {
      return foot(value, modalRef);
    } else {
      return (
        <ModalFooter>
          <Button onClick={() => {
            modalRef.close();
          }}>关闭</Button>
        </ModalFooter>
      );
    }
  };


  getCard = (files) => {
    const temp = [];
    _.map(files, file => {
      temp.push(<Card
        hoverable
        style={{width: 640}}
        cover={<img alt="example" src={file.preview}/>}
      >

      </Card>);
    });
    return temp;
  };


  render() {
    const {style, values} = this.props;
    const {fileList, lotDate, inboundCount, checkInfo = {}} = values;
    const {chkSpec = false, chkType = false, chkNumber = false, chkCount = false} = checkInfo;

    return (
      <div style={{...style}}>
        <Descriptions bordered size={'small'} column={2}>
          <Descriptions.Item label="检查入库物料规格是否符合：">{chkSpec ? "是" :
            <Tag color={"#f50"}>否</Tag>}</Descriptions.Item>
          <Descriptions.Item label="检查入库物料类型是否符合：">{chkType ? "是" :
            <Tag color={"#f50"}>否</Tag>}</Descriptions.Item>
          <Descriptions.Item label="检查入库物料编号是否符合：">{chkNumber ? "是" :
            <Tag color={"#f50"}>否</Tag>}</Descriptions.Item>
          <Descriptions.Item label="检查入库物料数量是否符合：">{chkCount ? "是" :
            <Tag color={"#f50"}>否</Tag>}</Descriptions.Item>
          <Descriptions.Item label="入库时间">{moment(lotDate).format('YYYY-MM-DD')}</Descriptions.Item>
          <Descriptions.Item label="入库数量">{inboundCount}</Descriptions.Item>
        </Descriptions>

        {
          this.getCard(fileList)
        }
        {this.renderFoot()}
      </div>

    );
  }
}

